<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="./css/bootstrap.css">
    <script src="./js/jQuery-3.7.1.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/layer/layer.js"></script>
</head>
<body>
<div class="container">

    <form>
        <div class="form-group row">
            <label for="desc" class="col-sm-3 col-form-label  text-md-right">描述</label>
            <div class="col-sm-8">
                <input type="text" placeholder="请输入描述" class="form-control" name="desc" id="desc">
            </div>
        </div>
        <div class="form-group row">
            <label for="txtFile" class="col-sm-3 col-form-label text-md-right">头像</label>
            <div class="col-sm-8">
                <input type="file" class="form-control" name="cover" id="txtFile" accept="image/*">
            </div>
        </div>
        <div class="form-group row">
            <div class="offset-sm-3">
                <img src="" width="130"  id="cover" alt="">
            </div>
        </div>
        <div class="form-group row">
            <div class="offset-sm-3">
                <button type="button" class="btn btn-primary" id="btnUpload">确定</button>
            </div>
        </div>
        <!--<div class="form-group row">
            <label for="loc" class="col-sm-3 col-form-label  text-md-right">部门地址</label>
            <div class="col-sm-8">
                <input type="text" placeholder="请输入部门地址" class="form-control" id="loc">
            </div>
        </div>-->
    </form>
</div>
</body>
<script>
    window.onload = function (){
        txtFile.onchange=function (){
            let file = this.files[0];
            let reader = new FileReader();
            reader.onload = function (e){
                cover.src = e.target.result;
            }
            reader.readAsDataURL(file);
        }


        $('#btnUpload').click(function (){

            let formData = new FormData(document.forms[0]);
            //formData.append("cover",txtFile.files[0]);

            $.ajax({
                url:'upload',
                method:'POST',
                data:formData,
                dataType:'JSON',
                processData:false,
                contentType:false,
            }).done(function (data){
                console.log(data)
            })
        })
    }
</script>
</html>